<template>
<div>
     <el-row :gutter='20'>
        <el-col :span='7'>
            <me-link></me-link>
            <me-notice></me-notice>
        </el-col>
        <el-col :span='17' class='main-cont'>
            <me-title :title='title'></me-title>
            <br>
            <div class='box-data-info'>
                <div class='title'>
                    <div class='name'>机甲DIY</div>
                    <div class='date'>2018-07-28</div>
                </div>
                <div class='article'>
                    <p>除了刚刚介绍的基本职业机甲外，别忘了有提到机甲有很多种不行的零件可以装备，所以，在众多机甲的配件中，玩家当然也可以自己组出相当多种的机甲造型套装，你的机甲最炫吗？！不！我的最炫！</p>
                    <p>以下是众多机甲套件中，建议玩家可以搭配出的几个造型，这些不同于正统职业的机甲DIY套装，不一定就是最好的组合搭配方式，只是提供给玩家参考喔。</p>
                    <div class='box-img'>
                        <img src='/static/image/data/diy-01.png'>
                    </div>
                    <div class='box-img'>
                        <img src='/static/image/data/diy-02.png'>
                    </div>
                    <div class='box-img'>
                        <img src='/static/image/data/diy-03.png'>
                    </div>
                    <div class='box-img'>
                        <img src='/static/image/data/diy-04.png'>
                    </div>
                    <div class='box-img'>
                        <img src='/static/image/data/diy-05.png'>
                    </div>
                    <div class='box-img'>
                        <img src='/static/image/data/diy-06.png'>
                    </div>
                    <div class='box-img'>
                        <img src='/static/image/data/diy-07.png'>
                    </div>
                </div>
            </div>
        </el-col>
    </el-row>
</div>
</template>

<script type="text/javascript">
import Link from '@/components/utils/Link'
import Notice from '@/components/utils/Notice'
import Title from '@/components/utils/Title'
import ScrollReveal from 'scrollreveal'
export default {
    components : {
        'me-link' : Link,
        'me-notice' : Notice,
        'me-title' : Title
    },
    data : function(){
        return {
            'title' : {
                'name' : '游戏资料',
                'sub' : 'GAME DATA',
                'posi' : '位置 > 游戏资料 > ',
                'now' : '机甲DIY',
                'icon' : '/static/image/data/icon-title.png'
            }
        }
    },
    mounted : function(){
        var sr = ScrollReveal({
            'origin' : 'bottom',
            'distance' : '20px',
            'duration' : 500,
            'delay' : 400
        })

        sr.reveal('.main-cont')
    }
}
</script>